﻿<!--<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="path" value="${pageContext.request.contextPath}" />-->
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>采购退货</title>
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/static/statics/h-ui/css/H-ui.min.css" />
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/static/statics/h-ui.admin/css/H-ui.admin.css" />

		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}
			
			.loadingModal {
				position: absolute;
				top: 40%;
				left: 25%;
				transform: translateX(-50%) translateY(-50%);
				
			}
			
			h4 {
				text-align: center;
				margin: 0;
				padding: 10px 0;
			}
			
			body {
				background: linear-gradient(#F3F8FF, #E2EEFF, #BCD9FF);
			}
			
			.d_head {
				background: #C0DBFF;
				padding: 10px 0 35px 0;
				position: relative;
			}
			
			.d_head ul {
				display: inline-block;
			}
			
			.d_head ul li span {
				display: inline-block;
				width: 45px;
				text-align: right;
				height: 25px;
				line-height: 25px;
			}
			
			.d_head ul li:nth-of-type(1) {
				margin-bottom: 5px;
			}
			
			.d_head ul li input {
				height: 25px;
				border: 1px solid #0000FF;
				width: 110px;
				text-indent: 5px;
			}
			
			.Wdate {
				width: 104px;
				height: 27px;
				text-indent: 0px;
			}
			
			.buttons {
				font-size: 14px;
				border-radius: 5px;
				border: 1px solid #92A5C7;
				width: 110px;
				height: 28px;
				text-align: center;
				background: linear-gradient(#DEECFF, #CAE1FF, #B6D6FF);
				color: #1E90FF;
				cursor: pointer;
			}
			
			.buttons:hover {
				background: linear-gradient(#B6D6FF, #CAE1FF, #DEECFF);
			}
			/*左边*/
			
			.cont_left {
				display: inline-block;
				width: 200px;
				border-bottom: 0;
				text-align: center;
				position: relative;
				bottom: 450px;
				
			}
			/*右边*/
			
			.cont_right {
				display: inline-block;
				overflow: auto;
				padding: 10px;
				border: 5px solid #1E90FF;
				width: 1450px;
				margin-top: 20px;
				height: 550px;
			}
			
			#lispan {
				display: inline-block;
				width: 80px;
				text-align: center;
				cursor: pointer;
				height: 28px;
				line-height: 28px;
			}
			
			#lispan:hover {
				line-height: 26px;
				width: 78px;
				border: 1px solid #6C757D;
				background: linear-gradient(#B6D6FF, #CAE1FF, #DEECFF);
				border-radius: 5px;
				color: #1E90FF;
			}
		</style>
		<script type="text/javascript" src="${pageContext.request.contextPath }/static/statics/lib/jquery/1.9.1/jquery.min.js"></script>
	</head>

	<body>
		<div>
			<h4>采购入库</h4>
			<div class="d_head">
				<ul>
					<li><span style="width: 60px;">票号</span> <input type="text" value="0666" style="border: 0; background: #C0DBFF;" />
						<span style="margin-left: 2px;">日期</span> <input class="form-control input-text Wdate" type="text" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd', defaultDate:'#now'})" />
					</li>
					<li>
						<a data-toggle="modal" type="button" class="btn btn-primary"
							data-target="#providerlist_Modal" style="color: white;">供应商</a> <input type="text" readonly="readonly" />
						<span style="width: 60px;">供方人员</span> <input type="text" value="小明" readonly="readonly" />
						<span>采购员</span> <input type="text" value="管理员" />
						<span>单据号</span> <input type="text" />
						<span>备注</span> <input type="text" />
					</li>
				</ul>
				<ul style="float: right;">
					
					<li>
						<input type="button" class="buttons"  data-toggle="modal" data-target="#chooseBillTuiHuo" value="选单退货" />
						<input type="button" class="buttons" data-toggle="modal" data-target="#dispatchBill" value="调单" />
						
					</li>
					<li><button class="buttons">新单</button> <button class="buttons">打印</button></li>
					<li style="position: absolute; right: 300px;">
						<span id="lispan">供货方档案</span>
					</li>
				</ul>
				<div style="position: absolute;bottom: 0; left: 50px;">
					供应商：<span>乐普(北京)医疗器械股份有限公司</span>, 地址：
					<span>北京市</span>, 联系人：
					<span>蒲中杰</span>, 电话：
					<span>13536985214</span>
				</div>
			</div>
		</div>
		<div class="contents">
			<div style="height: 40px; padding-left: 50px; line-height: 40px;">
				<span style="color: red">手术刀</span>(3# 全长6CM) 个 ,
				<span>产品注册证</span>:外贸器械生产许20181038号,
				<span>包装</span>:60,
				<span>储存条件</span>:常温
			</div>
			<div class="cont_left">
				<span>查找商品</span>
				<input class="control-label" type="text" id="varietyName"
							name="varietyName" /> <input type="button" class="buttons"
							value="..." data-toggle="modal"
							data-target="#selectProduct_modal" id="selectProduct_button"
							onclick="selectProduct()" /> <input type="hidden" id="varietyId"
							name="varietyId">
						
					
				<div>
					<span>数量</span>
				<input  type="text"/>
				</div>
				
				<br />
				<br />
				<div>
					<span>退货原因</span>
					<input type="text"/>
				
				</div>
			</div>
			<div class="cont_right">
				<table class="table table-border table-bordered table-bg table-sort" width="2500">
					<thead>
						<tr class="text-c">
							<th>品名</th>
							<th>生产厂家</th>
							<th>规格</th>
							<th>自编码</th>
							<th>单位</th>
							<th>数量</th>
							<th>件数</th>
							<th>显示进价</th>
							<th>实际进价</th>
							<th>实际金额</th>
							<th>批号</th>
							<th>生产日期</th>
							<th>有效期</th>
							<th>税点(%)</th>
							<th>采购带票</th>
							<th>批发价</th>
							<th>无税批发价</th>
							<th>批发价限价</th>
							<th>无税批发限价</th>
							<th>货区</th>
							<th>货位</th>
							<th>到货温度</th>
							<th>自定义1</th>
							<th>自定义2</th>
							<th>自定义3</th>
							<th>自定义4</th>
						</tr>
					</thead>
					<tbody>
						<tr class="text-c">
							<td>手术刀</td>
							<td>乐普医疗器械有限公司</td>
							<td>3# 全长6CM</td>
							<td></td>
							<td>个</td>
							<td>20</td>
							<td>0.333</td>
							<td>5000</td>
							<td>5000.00</td>
							<td>100000.000</td>
							<td></td>
							<td>2018-06-09</td>
							<td>2018-06-09</td>
							<td>0</td>
							<td>是</td>
							<td>0</td>
							<td>0</td>
							<td>0</td>
							<td>0</td>
							<td></td>
							<td></td>
							<td></td>
							<td></td>
							<td></td>
							<td></td>
							<td></td>
						</tr>
					</tbody>
				</table>
				<div style="position: absolute; bottom: 30px;">
					<button class="buttons">商品档案</button>
					<button class="buttons">修改</button>
					<button class="buttons">删除</button>
					<button class="buttons">全清</button>
					<button class="buttons">搜索</button>
				</div>
			</div>
		</div>

		<div id="dispatchBill" class="modal fade bs-example-modal-lg">
			<div class="modal-dialog " class="loadingModal">
				<div class="modal-content" style="width:200%;">
					<div class="modal-header">
						<h4 class="modal-title" style="text-align: center;">选择采购退货票</h4>
						<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
					</div>
					<div class="modal-body">
						<div class="mt-20">
							<form>
								<input type="checkbox">所有人票(默认显示本人票)

								<div style="border: 4px solid #1E90FF;width:1100px;padding: 20px;overflow-x: auto;">
									<table class="table table-border table-bordered table-hover table-bg putawayBill" style="width: 1300px;">
										<thead>
											<tr class="text-c">
												<th>票号</th>
												<th>日期</th>
												<th>供应商</th>
												<th>品种数</th>
												<th>金额</th>
												<th>采购员</th>
												<th>操作员</th>
												<th>票备注</th>
											</tr>
										</thead>
										<tbody>
											<tr class="text-c">
												<th>23015254</th>
												<th>2018-9-8</th>
												<th>乐普医疗器械</th>
												<th>1</th>
												<th>3698.00</th>
												<th>张三</th>
												<th>管理员</th>
												<th>票备注</th>
											</tr>
										</tbody>
									</table>
								</div>

							</form>
						</div>
					</div>
					<div class="modal-footer">
						<span style="position: absolute;left: 20px;">合计：共 1 条记录，总金额 3850元</span>
						<button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
						<button type="button" class="btn btn-primary">保存</button>
					</div>
				</div>
			</div>
		</div>
		
		<div id="chooseBillTuiHuo" class="modal fade bs-example-modal-lg">
			<div class="modal-dialog " class="loadingModal">
				<div class="modal-content" style="width:200%;">
					<div class="modal-header">
						<h4 class="modal-title" style="text-align: center;">选择退货票</h4>
						<span style="margin-left: 10px;">
							
							
							日期 <input class="form-control input-text Wdate datetime" id="startDate" type="text" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd', defaultDate:'#now'})" />
							至 <input class="form-control input-text Wdate datetime" type="text" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd', defaultDate:'#now'})" />
							<input type="checkbox" checked="checked" style="zoom: 130%;"/> 
							<input style="width: 30px；text-indent: 10px;font-size: 15px;"></input>
							<!--<div style="padding: 20px;"></div> -->
							<input class="buttons" type="button" style="width: 30px; height: 25px; outline: 0; margin-right: 10px;" value=" ..." data-toggle="modal" data-target="#providerlist" />
							票号：<input style="width: 10px；text-indent: 10px;font-size: 15px;"></input>
						</span>
						<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
					</div>
					<div class="modal-body">
						<div class="mt-20">
							<form>
								<input type="checkbox">所有人票(默认显示本人票)

								<div style="border: 4px solid #1E90FF;width:1100px;padding: 20px;overflow-x: auto;">
									<table class="table table-border table-bordered table-hover table-bg putawayBill" style="width: 1300px;">
										<thead>
											<tr class="text-c">
												<th>票号</th>
												<th>日期</th>
												<th>供应商</th>
												<th>品种数</th>
												<th>金额</th>
												<th>采购员</th>
												<th>操作员</th>
												<th>票备注</th>
											</tr>
										</thead>
										<tbody>
											<tr class="text-c">
												<th>23015254</th>
												<th>2018-9-8</th>
												<th>乐普医疗器械</th>
												<th>1</th>
												<th>3698.00</th>
												<th>张三</th>
												<th>管理员</th>
												<th>票备注</th>
											</tr>
										</tbody>
									</table>
								</div>

							</form>
						</div>
					</div>
					<div class="modal-footer">
						<span style="position: absolute;left: 20px;">合计：共 1 条记录，总金额 3850元</span>
						<button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
						<button type="button" class="btn btn-primary">保存</button>
					</div>
				</div>
			</div>
		</div>
		
		<!-- 供应商弹框 -->
	<div id="providerlist_Modal" class="modal fade bs-example-modal-lg">
		
		<div class="modal-dialog" id="loadingModal">
			<div class="modal-content" style="height: 500px; width: 250%;">
				<div class="modal-header">
					<h4 class="modal-title" style="text-align: center;">供应商</h4>
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
					</button>
					<div>
						<span>输入码</span>
						<input type="text" />
					</div>
				</div>
				<div class="modal-body">
					<div class="mt-20">
						<table id="providerList_table"
							class="table table-border table-bordered table-hover table-bg">
							<thead>
								<tr class="text-c">
									<th>供方编号</th>
									<th>输入码</th>
									<th>名称</th>
									<th>全称</th>
									<th>地址</th>
									<th>联系人</th>
									<th>联系电话</th>
									<th>备注</th>
								</tr>
							</thead>
							<tbody>
							</tbody>
						</table>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
				</div>
			</div>
		</div>
	</div>
		
		<script type="text/javascript" src="${pageContext.request.contextPath }/static/statics/lib/jquery/1.9.1/jquery.min.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath }/static/statics/lib/layer/2.4/layer.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath }/static/statics/h-ui/js/H-ui.min.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath }/static/statics/h-ui.admin/js/H-ui.admin.js"></script>

		<script type="text/javascript" src="${pageContext.request.contextPath }/static/statics/lib/My97DatePicker/4.8/WdatePicker.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath }/static/statics/lib/datatables/1.10.0/jquery.dataTables.min.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath }/static/statics/lib/laypage/1.2/laypage.js"></script>
		<script type="text/javascript">
			$(function() {
				$('.table-sort').dataTable({
					"aaSorting": [
						[1, "desc"]
					], //默认第几个排序
					"bStateSave": true, //状态保存
					"aoColumnDefs": [
						//{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
						{
							"orderable": false,
							"aTargets": [2, 3] // 制定列不参与排序
						}
					]
				});

				$('.putawayBill').dataTable({
					"aaSorting": [
						[0, "desc"]
					], //默认第几个排序
					"bStateSave": true, //状态保存
					"aoColumnDefs": [
						//{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
						{
							"orderable": false,
							"aTargets": [2, 5, 6, 7]
						} // 制定列不参与排序
					]
				});

				/*$('.table-sort tbody').on( 'click', 'tr', function () {
					if ( $(this).hasClass('selected') ) {
						$(this).removeClass('selected');
					}
					else {
						table.$('tr.selected').removeClass('selected');
						$(this).addClass('selected');
					}
				});*/

				$('td').parent().click(function() {
					$(this).toggleClass('back-color');
					$(this).siblings().removeClass('back-color');
				});

				$('#DataTables_Table_0_info').css('width', '200px');
				$('#DataTables_Table_0_length').css('width', '200px');

				$('.cont_right').scroll(function() {
					var obj = $(this);
					var value = obj.scrollLeft();

					$('#DataTables_Table_0_info').css('margin-left', (value + 'px'));
					$('#DataTables_Table_0_length').css('margin-left', (value + 'px'));

					$('#DataTables_Table_0_paginate').css('margin-right', ('-' + value + 'px'));
					$('#DataTables_Table_0_filter').css('margin-right', ('-' + value + 'px'));
				});
			});
			/*用户-添加*/
			function member_add(title, url, w, h) {
				layer_show(title, url, w, h);
			}
			/*用户-查看*/
			function member_show(title, url, id, w, h) {
				layer_show(title, url, w, h);
			}
			/*用户-停用*/
			function member_stop(obj, id) {
				layer.confirm('确认要停用吗？', function(index) {
					$(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" onClick="member_start(this,id)" href="javascript:;" title="启用"><i class="Hui-iconfont">&#xe6e1;</i></a>');
					$(obj).parents("tr").find(".td-status").html('<span class="label label-defaunt radius">已停用</span>');
					$(obj).remove();
					layer.msg('已停用!', {
						icon: 5,
						time: 1000
					});
				});
			}

			/*用户-启用*/
			function member_start(obj, id) {
				layer.confirm('确认要启用吗？', function(index) {
					$(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" onClick="member_stop(this,id)" href="javascript:;" title="停用"><i class="Hui-iconfont">&#xe631;</i></a>');
					$(obj).parents("tr").find(".td-status").html('<span class="label label-success radius">已启用</span>');
					$(obj).remove();
					layer.msg('已启用!', {
						icon: 6,
						time: 1000
					});
				});
			}
			/*用户-编辑*/
			function member_edit(title, url, id, w, h) {
				layer_show(title, url, w, h);
			}
			/*密码-修改*/
			function change_password(title, url, id, w, h) {
				layer_show(title, url, w, h);
			}
			/*用户-删除*/
			function member_del(obj, id) {
				layer.confirm('确认要删除吗？', function(index) {
					$(obj).parents("tr").remove();
					layer.msg('已删除!', {
						icon: 1,
						time: 1000
					});
				});
			}

			function change_back(obj, num) {
				obj.css("background", "dodgerblue");
				obj.siblings().css("background", "lightsteelblue");

				var ssdf = $('.modal-body-content').children('div:nth-of-type(' + num + ')');
				$('.modal-body-content').children('div:nth-of-type(' + num + ')').css('display', 'block');
				$('.modal-body-content').children('div:nth-of-type(' + num + ')').siblings().css('display', 'none');
			}
		</script>
	</body>

</html>